const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const { CleanWebpackPlugin } = require('clean-webpack-plugin');

const toml = require('toml');
const yaml = require('yamljs');
const json5 = require('json5');
module.exports = {
	mode: 'development',
	entry: './src/entry/resource.js',
	devtool: 'inline-source-map',
	devServer: {
		contentBase: './dist',
		port: 3000
	},
	plugins: [
		new CleanWebpackPlugin({ cleanStaleWebpackAssets: false }),
		new HtmlWebpackPlugin({
			title: '管理输出'
		})
	],
	output: {
		filename: '[name].[contenthash].js',
		path: path.resolve(__dirname, 'dist'),
		clean: true,
		publicPath: '/',
		assetModuleFilename: 'images/[hash][ext][query]'
	},
	module: {
		rules: [
			{
				test: /\.css$/i,
				use: [ 'style-loader', 'css-loader' ]
			},
			{
				test: /\.(png|svg|jpg|jpeg|gif)$/i,
				type: 'asset/inline'
				// type: 'asset/resource'
			},
			{
				test: /\.(woff|woff2|eot|ttf|otf)$/i,
				type: 'asset/resource'
			},
			{
				test: /\.(csv|tsv)$/i,
				use: [ 'csv-loader' ]
			},
			{
				test: /\.xml$/i,
				use: [ 'xml-loader' ]
			},
			{
				test: /\.toml$/i,
				type: 'json',
				parser: {
					parse: toml.parse
				}
			},
			{
				test: /\.yaml$/i,
				type: 'json',
				parser: {
					parse: yaml.parse
				}
			},
			{
				test: /\.json5$/i,
				type: 'json',
				parser: {
					parse: json5.parse
				}
			},
			{
				test: /\.html/,
				type: 'asset/resource',
				generator: {
					filename: 'static/[hash][ext][query]'
				}
			},
			{
				test: /\.txt/,
				type: 'asset/source'
			}
		]
	},
	optimization: {
		moduleIds: 'deterministic',
		runtimeChunk: 'single',
		splitChunks: {
			cacheGroups: {
				vendor: {
					test: /[\\/]node_modules[\\/]/,
					name: 'vendors',
					chunks: 'all'
				}
			}
		}
	}
};
